import React from 'react'
import './index.scss'
import NavBar from '../../../components/nav-bar'
import qs from 'qs'
import axios from '../../../utils/axios'
import {useHistory} from 'react-router-dom'
import {message} from '../../../components/message'

export default function EditDetail() {
  const history = useHistory()
  const { name, value } =
    qs.parse(window.location.search, { ignoreQueryPrefix: true }) || {}
  const handleSubmit = (e) => {
    e.preventDefault()
    console.log(e.target[0].value)
    let parmas
    if (name === '昵称') {
      parmas = { username: e.target[0].value }
    }
    if (name === '年龄') {
      parmas = { age: e.target[0].value }
    }
    if (name === '地区') {
      parmas = { area: e.target[0].value }
    }
    if (name === '个性签名') {
      parmas = { signature: e.target[0].value }
    }

    axios.post('/user/editUserInfo', parmas).then((res) => {
      console.log(res)
      if (res.data.code === 0) {
        message('修改成功~')
        // 提交成功
        history.go(-1)
      }
    })
  }
  return (
    <div>
      <NavBar roomName="编辑个人信息" showRight={false}></NavBar>
      <form onSubmit={handleSubmit}>
        <div className={'edit-detail'}>
          <span className={'edit-detail-label'}>{name}:</span>
          <input
            id="input"
            defaultValue={value}
            className={'edit-detail-input'}
          />
        </div>
        <input
          type="submit"
          className={'edit-detail-button'}
          value="确认修改"
        />
      </form>
    </div>
  )
}
